{% include 'XTGL/XTGL_index.html' %}

<div class="am-cf admin-main">
{% include 'sidebar.html' %}
  <!-- content start -->
  <div class="admin-content">
    <div class="admin-content-body">
      <div class="am-cf am-padding">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">角色管理</strong></div>
      </div>

      <div class="am-g">
        
        <div class="am-u-sm-12">
          <div class="am-u-sm-12 am-u-md-6">
          <div class="am-btn-toolbar">
            <div class="am-btn-group am-btn-group-xs">
              <button type="button" class="am-btn am-btn-default am-btn-xs am-text-secondary" onclick="role_add()"><span class="am-icon-plus"></span>新增</button>
            </div>
          </div>
        </div>
          <table id="grid" class="am-table am-table-striped am-table-hover table-main am-table-compact am-text-nowrap" width="100%">
            <thead>
              <tr>
                <th class="table-title">序号</th>
                <th class="table-title">角色名称</th>
                <th class="table-title">角色描述</th>
                <th class="table-set">操作</th>
              </tr>
            </thead>
            <tbody></tbody>
          </table>
        </div>
      </div>
    </div>
  <!-- content end -->
  </div>
{% include 'footer.html' %}
<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="/static/assets/js/jquery.min.js"></script>
<!--<![endif]-->
<script src="/static/assets/js/amazeui.min.js"></script>
<script src="/static/assets/js/amazeui.tree.js"></script>
<script type="text/javascript" src="/static/assets/js/layer.js"></script>
<script src="/static/assets/datatables/amazeui.datatables.min.js"></script>
<script src="/static/assets/dialog/amazeui.dialog.min.js"></script>
<link rel="stylesheet" type="text/css" href="/static/assets/css/amazeui.tree.css" />
<script src="/static/assets/js/app.js"></script>
<script type="text/javascript">
$("#collapse-nav").addClass("am-in");
$("#xtgl").removeClass("am-collapsed");
$("#xtglOjsgl").css("color","#3399CC");
$("#xtgl").css("color","#3399CC");

  /*
  $.extend(true, $.fn.dataTable.defaults, {
    "dom": "l<'#toolbar'>frtip"
  });

  */
var t = $('#grid').DataTable({
  //配置DataTables默认参数



    bInfo: false,//页脚信息
    responsive: true,
    searching: true,
    lengthChange: false,
    paging: false,
    ajax: {

      url: "/XTGL_JSGL_1/"
    },
    //每页显示五条数据
    //pageLength: 'all',
    columns: [
      {  
        data : null,  
        bSortable : false,  
        targets : 0,  
        //width : "30px",  
        render : function(data, type, row, meta) {  
          // 显示行号  
          var startIndex = meta.settings._iDisplayStart;  
          return startIndex + meta.row + 1;  
        }  
      },
      {
        "data": "name"
      },
      {
        "data": "description"
      },
      {
        "data": "description"
      }
    ],
    "columnDefs": [
      // "visible": false,
      //"targets": 0
      {
        type: 'chinese-string',
        targets: '_all'
      } //中文排序
      ,
      {
        "render": function(data, type, row, meta) {
          return '<div class="am-btn-toolbar"><div class="am-btn-group am-btn-group-xs"><button class="am-btn am-btn-default am-btn-xs am-text-secondary" onclick="role_modify(' + row.role_id + ')"><span class="am-icon-pencil-square-o"></span> 修改</button><button class="am-btn am-btn-default am-btn-xs am-text-secondary" onclick="role_configure(' + row.role_id + ')"><span class="am-icon-cog"></span> 配置</button><button class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only" onclick="role_delect(' + row.role_id + ',\'' + row.name + '\')"><span class="am-icon-trash-o"></span> 删除</button></div></div>'        
        },
        //指定是第二列
        "targets": 3
      }
    ],
    /*
    initComplete: function () {
      //表格加载完毕，手动添加按钮到表格上
      $("#toolbar").css("width", "100px").css("display", "inline").css("margin-left", "10px");
      $("#toolbar").append("<a href='https://github.com/ssy341/datatables-cn/issues/new' " + "class='btn btn-primary btn-sm' target='_blank'>我有问题</a>");


    }
    */
  });
  function role_add(){
    //window.location.href="/XTGL_BMGL_ADD/"
    popup1("新增角色","/XTGL_JSGL_ADD/")
  }
  function role_modify(role_id){
    popup1("修改角色","/XTGL_JSGL_MODIFY/?role_id="+role_id+"")
  }
  function role_configure(role_id){
    popup2("权限配置","/XTGL_JSGL_CONFIGURE/?role_id="+role_id+"")
  }
  /*
  function role_delect(role_id){
    $.ajax({
      "url":"/XTGL_JSGL_7/?role_id="+role_id+"",
      "datatype":"json",
      "type":"post",
      "async":"false"
      }).success(function(data){
        if (data.status == 1) {
          window.location.reload();
        } else {
          AlertMSG(data.message)
        }
      }).error(function(data){
        AlertMSG("删除失败！")
      });
  }
  */
  function role_delect(role_id,name){
    AMUI.dialog.confirm({
      title: '删除确认',
      content: '您确认删除['+name+']?',
      onConfirm: function() {
        //console.log('onConfirm,save ' + organize_id);
        $.ajax({
      "url":"/XTGL_JSGL_7/?role_id="+role_id+"",
      "datatype":"json",
      "type":"get",
      "async":"false"
      }).success(function(data){
        if (data.status == 1) {
          window.location.reload();
        } else {
          AlertMSG(data.message)
        }
      }).error(function(data){
        AlertMSG("删除失败！")
      });
      },
      onCancel: function() {
        console.log('onCancel')
      }
    });
  };

  function popup1(title,url){
    var index = layer.open({
      type: 2,
      title: title,
      content: url,
      area: ['600px', '300px'],
            
    });  
        //铺满界面
        //layer.full(index);
  }

  function popup2(title,url){
    var index = layer.open({
      type: 2,
      title: title,
      content: url,
      area: ['700px', '420px'],
            
    });  
        //铺满界面
        //layer.full(index);
  }

  var AlertMSG=function(msg){
    AMUI.dialog.alert({ title: '错误提示', content: msg, onConfirm: function() { console.log('close'); } });
  }
</script>
</body>
</html>
